<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>订单管理</title>
  <th:block th:include="base::header"/>
</head>
<body>
<div class="x-nav">
		<span class="layui-breadcrumb"> <a href="">首页</a> <a href="">用户管理</a>
			<a> <cite>用户展示</cite></a>
		</span> <a class="layui-btn layui-btn-small"
                   style="line-height: 1.6em; margin-top: 3px; float: right"
                   onclick="location.reload()" title="刷新"> <i
        class="layui-icon layui-icon-refresh" style="line-height: 30px"></i></a>
</div>
<div class="layui-fluid">
  <div class="layui-row layui-col-space15">
    <div class="layui-col-md12">
      <div class="layui-card">
        <div class="layui-card-body layui-table-body layui-table-main">

          <form class="layui-form layui-col-space5">
            <div class="layui-inline">
              <select name="attr" lay-filter="select">
                <option value="1" selected>订单编号</option>
                <option value="2">客户名称</option>
                <option value="3">产品名称</option>
              </select>
            </div>
            <div class="layui-inline layui-show-xs-block">
              <input id="input" type="text" name="username" placeholder="请输入"
                     autocomplete="off" class="layui-input">
            </div>
            <div class="layui-inline layui-show-xs-block">
              <button id="search" class="layui-btn" >
                <i class="layui-icon">&#xe615;</i>
              </button>
            </div>
          </form>
          <table class="layui-table layui-form" lay-data="{id: 'idTest'} " lay-filter="test"id="table">
          </table>
        </div>

      </div>
    </div>
  </div>
</div>
</body>
<script type="text/html" id="toolbarDemo">
  <div class="layui-btn-container">
    <button class="layui-btn layui-btn-sm" lay-event="add"><i class="layui-icon">&#xe61f;</i>添加</button>
    <button class="layui-btn layui-btn-sm" lay-event="delete"><i class="layui-icon">&#x1006;</i>删除</button>
    <button class="layui-btn layui-btn-sm" lay-event="update"><i class="layui-icon">&#xe642;</i>编辑</button>
  </div>
</script>
<script>
  var url1="list";
  var url2="search"
  $(function(){
    load(url1);
  });

  function load(url){
    var type=1;
    layui.use([ 'laydate', 'form', 'table','jquery' ], function() {
      var laydate = layui.laydate;
      var form = layui.form;
      var table = layui.table;
      $=layui.jquery;
      table.render({
        height : 512,
        elem : '#table',
        toolbar: '#toolbarDemo',
        url : url,
        page : true,
        parseData: function(res){ //res 即为原始返回的数据
          return {
            "code": res.code, //解析接口状态
            "msg": res.msg, //解析提示文本
            "count": res.data.total, //解析数据长度
            "data": res.data.list //解析数据列表
          };
        },
        id: 'idTest',
        cols : [
                [
          {type:'checkbox',width:60},
          {field : 'orderId',title : '订单编号', sort : true,align : 'center'},
          {field : 'customId',title : '客户',align : 'center',templet: '<div><a onclick="editCustomer(this,{{d.customId}})" href="javascript:;" class="layui-table-link">{{d.customer.customName}}</a></div>'},
          {field : 'productId',title : '产品',align : 'center',templet: '<div><a onclick="editProduct(this,{{d.customId}})" href="javascript:;" class="layui-table-link">{{d.product.productName}}</a></div>'},
          {field : 'quantity',title : '数量', align : 'center'},
          {field : 'unitPrice', title : '单价', align : 'center'},
          {field : 'unit',title : '单位', align : 'center'},
          {field : 'orderDate',title : '订单日期',align : 'center',templet:"<div>{{layui.util.toDateString(d.orderDate, 'yyyy-MM-dd HH:mm:ss')}}</div>"},
          {field : 'requestDate',title : '要求日期',align : 'center',templet:"<div>{{layui.util.toDateString(d.requestDate, 'yyyy-MM-dd HH:mm:ss')}}</div>"},
          {field : 'status',title : '状态', align : 'center',templet: function (d) {
            if (d.status==1){
              return "未开始";
            }else if(d.status==2){
              return "进行中";
            }else if(d.status==3){
              return "进行中";
            }else{
              return "已结束";
            }
          }},
          {title : '订单要求',align : 'center',templet: '<div><a onclick="requirement(this,{{d.orderId}})" href="javascript:;" class="layui-table-link">订单要求</a></div>'},
          {field : 'image', title : '图片',align : 'center',templet: '<div><a onclick="loadPicture(this,{{d.orderId}})" href="javascript:;" class="layui-table-link">点击查看</a></div>'},
          {title : '订单附件',align : 'center',templet: '<div><a onclick="loadFile(this,{{d.orderId}})" href="javascript:;" class="layui-table-link">点击查看</a></div>'},

          //{title : '操作',align : 'center',templet: '<div><a href="/detail/{{d.id}}" class="layui-table-link">{{d.title}}</a></div>'},
        ]
        ]

      });
      /* table.on('checkbox(test)', function(obj){
            console.log(obj); //当前行的一些常用操作集合
            console.log(obj.checked); //当前是否选中状态
            console.log(obj.data); //选中行的相关数据
            console.log(obj.type); //如果触发的是全选，则为：all，如果触发的是单选，则为：one
          }); */
      laydate.render({
        elem: '#time'
        ,type: 'datetime'
      });
      //触发事件
      form.on('select(select)', function(data){
        console.log(data.value);
        type=data.value;
      });
      $("#search").click(function(){

        var condition=$("#input").val();
        if (condition=="") {
          layer.msg("未输入内容",{
            icon: 2,
            time: 1000
          })
        }else{
          url2=url2+"?type="+type+"&condition="+condition;
          console.log(url2);
          load(url2);
          url2="search";
          return false;
        }
      });

      table.on('toolbar(test)', function(obj){
        var checkStatus = table.checkStatus(obj.config.id);
        switch(obj.event){
          case 'add':
          {
            //layer.msg('添加');
            xadmin.open('添加工艺要求','toadd',800,600);
          }
            break;
          case 'delete':
          {
            layer.confirm('确认要删除吗？', function() {
              console.log(checkStatus);
              var data=checkStatus.data;
              var ids=[];
              $.each(data,function (index,item) {
                ids.push(item.orderId);
              });
              //怎么向后面传递数组？
              $.post("delete",{'ids':ids.join(',')},function(res){
                if(res.msg){
                  layer.msg('已删除!', {
                    icon : 1,
                    time : 1000
                  },function() {
                    location.reload();
                  });
                }else {
                  if(res.msg==null){
                    layer.msg(res,{icon:2,time:2000});
                  }else {
                    layer.msg(res.msg,{icon:2,time:2000});
                  }
                }

              });
            });
          }
            break;
          case 'update':
          {
            //layer.msg('编辑');
            var data=checkStatus.data;
            if (data.length==1) {
              var id=data[0].orderId;
              console.log(data);
              xadmin.open('编辑用户','toedit?id='+id,800,600);
            }else if (data.length==0) {
              layer.msg('未选择!', {
                icon : 3,
                time : 1000
              });
            }else{
              layer.msg('只能选择一个编辑!', {
                icon : 3,
                time : 1000
              });
            }
          }
            break;
        }
      });
    });
  }
  function editCustomer(obj,id){
    xadmin.open('编辑','tocustomer?id='+id,800,600);
  }
  function editProduct(obj,id){
    xadmin.open('编辑','toproduct?id='+id,800,600);
  }

  function requirement(obj,id){
    console.log(id);
    xadmin.open('编辑订单要求','torequirement?id='+id,800,600);
  }
  function loadPicture(obj,id){
    console.log(id);
    xadmin.open('查看图片','picture?id='+id,800,600);
  }
  function loadFile(obj,id){
    console.log(id);
    xadmin.open('查看文件','file?id='+id,800,600);
  }

  /*用户-删除*/
  /*function member_del() {
      layui.use([ 'laydate', 'form', 'table' ], function() {
          var laydate=layui.laydate;
          var form=layui.form;
          var table=layui.table;


          layer.confirm('确认要删除吗？', function(index) {
              //发异步删除数据
              $.get("http://localhost:8080/Project01/user/deleteuser",{"id":id},function(){

                  $(obj).parents("tr").remove();

                  layer.msg('已删除!', {
                      icon : 1,
                      time : 1000
                  });
                  location.reload();
              });
              var checkStatus = table.checkStatus('idTest'); //idTest 即为基础参数 id 对应的值

              console.log(typeof checkStatus) //获取选中行的数据
              console.log(checkStatus.data.length) //获取选中行数量，可作为是否有选中行的条件
              console.log(checkStatus.isAll ) //表格是否全选
          });
      });
  } */

</script>
</html>
